<template>
	<div id="app">
		<div>
			<div>
				<vheader></vheader>
			</div>
			<div class="main">
				<router-view></router-view>
			</div>
			<div class="main">
				<vfooter></vfooter>
			</div>
		</div>
		<div class="block-sidebar">
			<img src="@/assets/images/top.png" style="width: 30;height: 30px;" @click="topmost()" />
			<p />
			<router-link to="/cart"><img src="@/assets/images/shoppingCart.png" style="width: 30;height: 30px;" /></router-link>
			<p />
			<img src="@/assets/images/answer.png" style="width: 30;height: 30px;" @click="qa()" />
		</div>
	</div>
</template>


<script>
	import vfooter from '@/components/vfooter'
	import vheader from '@/components/vheader'
	export default {
		name: 'App',
		data() {
			return {

			};
		},
		components: {
			vfooter,
			vheader
		},
		methods: {
			qa() {
				this.$router.push({
					path: '/qa'
				})
			},
			topmost() {
				window.scroll(0, 0);
			}
		}
	}
</script>

<style>
	@font-face {
		font-family: 'Glyphicons Halflings';
		src: url('./fonts/glyphicons-halflings-regular.eot');
		src: url('./fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
			url('./fonts/glyphicons-halflings-regular.woff') format('woff'),
			url('./fonts/glyphicons-halflings-regular.ttf') format('truetype'),
			url('./fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
	}


	#app {
		font-family: Glyphicons Halflings;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-align: left;
		/*color: #00AB42 !important;*/
		margin: 0 auto;
		width: 92%;
		background-color: #FFFFFF;
	}

	.main {
		margin: 5px 15px;
	}

	a:-webkit-any-link {
		color: ##00AB42 !important;
		text-decoration: none;
	}

	.block-sidebar {
		position: fixed;
		display: block;
		right: 15px;
		bottom: 100px;
		width: 30px;
		z-index: 99;
		border: #00AB42 1px solid;
		padding: 4px;
	}


	.el-pagination .btn-next .el-icon,
	.el-pagination .btn-prev .el-icon {
		margin-top: 5px !important;
	}
</style>
